<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>博客登录</title>
		<link rel="shortcut icon" href="img/touxiang.jpg">
		<link rel="stylesheet" type="text/css" href="./css/RegisterCss.css"/>
		<script src="js/jquery-3.3.1.js" type="text/javascript" charset="utf-8"></script>
		<script src="./js/RegisterJs.js" type="text/javascript" charset="utf-8"></script>
	</head>
	<body>
		<a href="index.html">
			<div class="Home_buttom">
				<i class="icomoon"></i>
			</div>
		</a>
		<div class="main">
			<!-- 登录盒子 -->
			<div class="container Loginbox">
				<form class="form" action method>
					<h2 class="tittle">登录博客</h2>
					<div class="form__icon">
						<a href="">
							<i class="QQ-icon icon"></i>
						</a>
						<a href="">
							<i class="Wx-icon icon"></i>
						</a>
						<a href="">
							<i class="Wb-icon icon"></i>
						</a>
					</div>
					<span class="form__span">or use your phone account</span>
					<div class="InputBox">
						<input class="form__input" type="text" placeholder="Phone" id="login"/>
						<span class="mdn"></span>
					</div>
					<div class="InputBox">
						<input class="form__input" type="password" placeholder="PassWord" id="PassWord"/>
						<span class="mdn"></span>
					</div>
					<a href="" class="form__Forget">忘记密码?</a>
					<button type="button">登录</button>
				</form>
				
			</div>
			<!-- 注册盒子 -->
			<div class="container Registerbox">
				<form class="form" action method>
					<h2 class="tittle">注册会员</h2>
					<div class="form__icon">
						<a href="">
							<i class="QQ-icon icon"></i>
						</a>
						<a href="">
							<i class="Wx-icon icon"></i>
						</a>
						<a href="">
							<i class="Wb-icon icon"></i>
						</a>
					</div>
					<span class="form__span">or use your phone registration</span>
					<!-- 输入用户名 -->
					<div class="InputBox">
						<input class="form__input" type="Name" placeholder="UserName" id="login"/>
						<span class="mdn"></span>
					</div>
					<!-- 输入密码 -->
					<div class="InputBox">
						<input class="form__input" type="password" placeholder="PassWord" id="PassWord"/>
						<span class="mdn"></span>
					</div>
					<div class="InputBox">
						<input class="form__input" type="text" placeholder="Phone" id="Phone"/>
						<span class="mdn"></span>
					</div>
					<button type="button">注册</button>
				</form>
			</div>
			<!-- 选择切换盒子 -->
			<div class="Switchbox" id="switch-cnt">
				<div class="Switch S1 is-hidden">
					<h2 class="tittle" style="">欢迎回来!</h2>
					<p class="description">输入账号密码登录我的博客吧!</p>
					<button type="button" id="Login">立即登录</button>
				</div>
				<div class="Switch S2 ">
					<h2 class="tittle">你好朋友!</h2>
					<p class="description">输入您的个人信息,注册成为我博客的会员吧!</p>
					<button type="button" id="Register">立即注册</button>
				</div>
				<div class="lb-box">
					<!-- 轮播内容 -->
					<div class="lb-Content">
						<ul class="slider">
							<li>
								<a href="https://mp.weixin.qq.com/s/6g1b4hKgAvIWyKBZJc2_eA">
									<img src="img/ShowImg1.jpg" >
									<span>Xus 丨 新年新气象，我的第一篇分享文章！</span>
								</a>
							</li>
							<li>
								<a href="https://mp.weixin.qq.com/s/h2hyn3V8IlAKGu9HrpGLkg">
									<img src="img/ShowImg2.jpg" >
									<span>Xus | 第一篇技术文章 -【1.服务器与公众号的对接】</span>
								</a>
							</li>
							<li>
								<a href="https://mp.weixin.qq.com/s/qrfYAn4OQitHVuW9oQeHaw">
									<img src="img/ShowImg3.jpg" >
									<span>Xus | 分析校园视频课程网站</span>
								</a>
							</li>
						</ul>
					</div>
					<!-- 轮播控制 -->
					<div class="lb-ctrl__left lb-button" id="left">
						<i class="icomoon"></i>
					</div>
					<div class="lb-ctrl__right lb-button" id="right">
						<i class="icomoon"></i>
					</div>
				</div>
			</div>
		</div>
	</body>
</html>
